<template>
	<view class="my_list">
		<view class="my_it" v-for="item,i in list" :key="i">
			<view class="flex_between goods">
				<image :src="item.pintuan_card_info.img"></image>
				<view class="goods_info">
					<view class="clamp2">{{item.pintuan_card_info.name}}</view>
					<view class="g_price"><text>￥</text>{{item.pintuan_card_info.price}}</view>
				</view>
			</view>
			<view class="my_t flex_between">
				<view>参团人数：
					<text v-if="item.status==1">还差{{item.remain_num}}人拼成</text>
					<text v-else-if="item.status==2">共计参团{{item.pintuan_card_info.success_num}}人</text>
					<text v-else-if="item.status==3">未达到参团人数要求</text>
				</view>

				<view class="my_status" :class="{'my_status2':item.status==2,'my_status3':item.status==3}">
					{{item.status==1?'拼团中':item.status==2?'拼团成功':'拼团失败'}}
				</view>
				<!-- <view class="my_status" >
					拼团中
				</view> -->
			</view>
			<view class="people_list flex_align_center">
				<!-- <view class="peo_it" :class="{'peo_logo_ac':it.membership==1,'peo_logo_ac2':it.status==2}" v-for="it in item.member_list"> -->
				<!-- v-if="item2.membership==1" -->
				<view class="peo_it" :class="{'peo_logo_ac':item2.membership==1}"
					v-for="item2,i2 in item.pintuan_list_detail_info" :key="i2+'1'">
					<view class="peo_logo ">
						<image :src="item2.member_info.avatar"></image>
					</view>
					<view class="pep_sta" v-if="item2.membership==1">发起人</view>
					<view class="clamp">{{item2.member_info.nickname}}</view>
				</view>
				<!-- <button open-type="share"> -->
				<view class="peo_it" v-if="item.status==1" @click="joinSumbit(item)">
					<view class="peo_logo">
						<image src="https://img.jinghushi.com/images/9/2025/10/MXLKyc6YzCX1Or6VXRc1lVH4ghXHkx.png">
						</image>
					</view>
					<view class="clamp">邀请组队</view>
				</view>
			</view>
			<!-- 	<block v-if="item.member_list.length>=14">
				<view class="open flex_center" v-if="!item.openStatus" @click="changeOpen(idx,true)">
					<view class="line"></view>
					<view class="open_tit">展开</view>
					<image src="/static/my/down.png"></image>
					<view class="line"></view>
				</view>
				<view class="open flex_center" v-else @click="changeOpen(idx,false)">
					<view class="line"></view>
					<view class="open_tit">收起</view>
					<image src="/static/my/down.png" class="open2"></image>
					<view class="line"></view>
				</view>
			</block> -->
			<!-- <view class="order_status"
				>
				{{item.button_info.button_str}}
			</view> -->
			<view v-if="item.status==1" class="order_status" @click="joinSumbit(item)">
				邀请好友参团
			</view>
			<view class="order_status bg" v-else-if="item.status!=1&&item.pintuan_reward_info.length>0">
				<text v-for="item3,i3 in item.pintuan_reward_info" :key="i3+'3'">
					<text v-if="i3!=0">、</text>
					<text>{{item3.money}}{{item3.name}}</text>
				</text>
			</view>
		</view>
		<view class="empty_loading2">
			<image v-if="isloading" src="/static/business/loading.gif"></image>
			<view v-if="isempty">———— <text>没有更多了</text> ————</view>
		</view>
		<shareMenu ref="shareMenu" :isMore="false" />
	</view>
</template>

<script>
	import shareMenu from '@/components/share-menu.vue';
	export default {
		components: {
			shareMenu
		},
		props: {
			list: {
				type: Array,
				default: () => []
			},
			isloading: {
				type: Boolean,
				default: true,
			},
			isempty: {
				type: Boolean,
				default: true,
			}
		},
		methods: {
			joinSumbit(e) {
				// #ifdef H5
				e.url=`/pages/groupbuy/product?pintuan_list_id=${e.id}&goodsid=${e.goodsid}`
				this.$refs.shareMenu.open(e)
				return
				// #endif
				uni.showLoading({
					title: '请稍候'
				})
				let title = '消费享补贴，就用多米街';
				if (e.pintuan_list_detail_info && e.pintuan_list_detail_info[0] && e.pintuan_list_detail_info[0]
					.member_info) {
					title = `${e.pintuan_list_detail_info[0].member_info.nickname} 发起${e.pintuan_card_info.name}`
				} else if (e.pintuan_card_info && e.pintuan_card_info.name) {
					title = e.pintuan_card_info.name
				}
				if (e) {
					this.$axios('WxInfo/getConfig', 'POST', 'shop', {
						url: '/pages/groupbuy/product?pintuan_list_id=' + e.id + '&goodsid=' + e.goodsid,
					}).then(res => {
						uni.hideLoading()
						if (res.data.code == 200) {
							this.$emit('changeInfo', {
								title: title,
								imgurl: e.pintuan_card_info.img,
								url: res.data.data.shareinfo.url
							})
							this.$refs.shareMenu.open(e)
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my_list {
		padding: 20rpx 0 60rpx;

		.my_it {
			background: #fff;
			border-radius: 24rpx;
			padding: 20rpx;
			margin-bottom: 20rpx;

			.my_t {
				color: #5B5B5B;

				text {
					color: #13001E;
				}

				.my_status {
					background: rgba(154, 31, 232, 0.15);
					line-height: 34rpx;
					width: 112rpx;
					border-radius: 8rpx;
					color: #9A1FE8;
					font-size: 20rpx;
					text-align: center;
				}

				.my_status2 {
					background: rgba(7, 193, 96, 0.15);
					color: #07C160;
				}

				.my_status3 {
					background: rgba(153, 153, 153, 0.15);
					color: #999999;
				}
			}

			.goods {
				padding: 0 0 20rpx;
				border-bottom: 2rpx dashed #eee;
				margin-bottom: 20rpx;

				image {
					width: 144rpx;
					height: 144rpx;
					border-radius: 8rpx;
					flex-shrink: 0;
				}

				.goods_info {
					flex: 1;
					color: #13001E;
					padding-left: 20rpx;

					.g_price {
						font-weight: bold;
						font-size: 32rpx;
						color: #9A1FE8;
						text-align: right;
						margin-top: 28rpx;

						text {
							font-weight: normal;
							font-size: 24rpx;
						}
					}
				}
			}

			.people_list {
				flex-wrap: wrap;
				margin: 10rpx -20rpx 0;
				max-height: 250rpx;
				padding: 20rpx 0;
				overflow: hidden;
				position: relative;

				.peo_it {
					width: calc(100% / 7);
					text-align: center;
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					margin-bottom: 20rpx;
					padding: 0 10rpx;

					.peo_logo {
						width: 64rpx;
						height: 64rpx;
						border-radius: 50%;
						border: 4rpx solid transparent;

						image {
							width: 100%;
							height: 100%;
							border-radius: 50%;
						}
					}

					.clamp {
						width: 100%;
						color: #13001E;
						font-size: 20rpx;
						margin-top: 8rpx;
					}
				}

				.peo_logo_ac {
					position: relative;

					.peo_logo {
						border: 4rpx solid #9A1FE8;
					}

					.pep_sta {
						background: #9A1FE8;
						line-height: 24rpx;
						border-radius: 8rpx;
						padding: 0 6rpx;
						color: #FFFFFF;
						font-size: 14rpx;
						font-weight: bold;
						position: absolute;
						top: -10rpx;
					}
				}

				.peo_logo_ac2 {
					position: relative;

					.peo_logo {
						border: 4rpx solid #07C160;
					}

					.pep_sta {
						line-height: 24rpx;
						border-radius: 8rpx;
						padding: 0 6rpx;
						color: #FFFFFF;
						font-size: 14rpx;
						font-weight: bold;
						position: absolute;
						top: -10rpx;
						background: #07C160;
					}
				}
			}

			.people_list2 {
				height: auto;
				max-height: 2000rpx;
			}

			.open {
				margin-top: 10rpx;

				.line {
					flex: 1;
					border-bottom: 2rpx dashed #eee;
				}

				.open_tit {
					margin-left: 20rpx;
					color: #999999;
				}

				image {
					width: 34rpx;
					height: 18rpx;
					margin-left: 16rpx;
					margin-right: 20rpx;
				}

				.open2 {
					transform: rotateZ(-180deg);
				}
			}

			.order_status {
				background: #9A1FE8;
				line-height: 72rpx;
				width: 100%;
				border-radius: 144rpx;
				color: #FFFFFF;
				font-size: 24rpx;
				font-weight: bold;
				text-align: center;
				margin: 24rpx 0 10rpx;
			}

			.bg {
				background: #f4e8fc;
				color: #9A1FE8;
			}
		}
	}

	.empty_loading2 {
		color: #9E9E9E;
		text-align: center;
		padding: 20rpx 0;

		text {
			padding: 0 20rpx;
		}

		image {
			height: 60rpx;
			width: 60rpx;
		}
	}
</style>